<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="utf-8" />
    <meta name="format-detection" content="telephone=no">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <title>附近顾问</title>
    <script>;(function(){var W=750,w=parseInt(window.screen.width),s=w/W,u=navigator.userAgent.toLowerCase(),m='<meta name="viewport" content="width='+W+',';if(/android (\d+\.\d+)/.test(u)){if(parseFloat(RegExp.$1)>2.3)m+='minimum-scale='+s+',maximum-scale='+s+',';}else{m+='user-scalable=no,';}m+='target-densitydpi=device-dpi">';document.write(m);}());</script>
    <link href="el-imfans/resources/wapItem/wap_new/css/custom.css" rel="stylesheet" type="text/css">
    <style type="text/css">
        /*html5*/
        article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}
        .sectionList li span.l_store{color:#333;width:330px;}
        .sectionList li span.l_guwen{color:#999;width:162px;padding:0 8px;}
        .sectionList li span.l_distance{color:#ccc;width:136px;}
    </style>
    <!--[if lt IE 9]>
    <script type="text/javascript">
        var e = "abbr, article, aside, audio, canvas, datalist, details, dialog, eventsource, figure, footer, header, hgroup, mark, menu, meter, nav, output, progress, section, time, video".split(', ');
        var i= e.length;
        while (i--){
            document.createElement(e[i])
        }
    </script>
    <![endif]-->
    
<script src="el-imfans/resources/wapItem/wap_new/js/jquery-1.10.2.min.js"></script>
<script src="el-imfans/resources/js/jweixin-1.1.0.js"></script>
<script type="text/javascript">
    function onBridgeReady(){
        WeixinJSBridge.call('hideOptionMenu');
    }

    if (typeof WeixinJSBridge == "undefined"){
        if( document.addEventListener ){
            document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
        }else if (document.attachEvent){
            document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
            document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
        }

    }else{
        onBridgeReady();
    }
</script>
</head>
<body class="pb-250">
<div class="mainBox">
    <div class="locationMap" id="allmap">
        
    </div>
    <input type="hidden" id="longitude" />
    <input type="hidden" id="latitude" />
    <input type="hidden" id="province-l" />
    <input type="hidden" id="city-l" />
    <input type="hidden" id="district-l" />
    <input type="hidden" id="street-n-l" />
    <input type="hidden" id="location-s" />
    <input type="hidden" id="circleList" />
    <div class="locationBox box-size">
        <div class="local-sel-box box-size f-left">
            <select class="local-sel f-left box-size" id="provinceSelect">
                <option lng="" lat="" value="">请选择</option>
                
                    <option lng="116.39564503787867" lat="39.92998577808024" value="110000000000">北京市</option>
                
                    <option lng="117.21081309155257" lat="39.143929903310077" value="120000000000">天津市</option>
                
                    <option lng="115.66143362422224" lat="38.61383974925108" value="130000000000">河北省</option>
                
                    <option lng="112.51549586383865" lat="37.86656599050925" value="140000000000">山西省</option>
                
                    <option lng="114.41586754816612" lat="43.46823822194904" value="150000000000">内蒙古自治区</option>
                
                    <option lng="122.75359155771858" lat="41.62160010595761" value="210000000000">辽宁省</option>
                
                    <option lng="126.26287593077805" lat="43.67884618524125" value="220000000000">吉林省</option>
                
                    <option lng="128.0474137149926" lat="47.35659164311141" value="230000000000">黑龙江省</option>
                
                    <option lng="121.48789948569473" lat="31.24916171001514" value="310000000000">上海市</option>
                
                    <option lng="119.36848893835847" lat="33.01379716995394" value="320000000000">江苏省</option>
                
                    <option lng="119.95720242066378" lat="29.159494120760927" value="330000000000">浙江省</option>
                
                    <option lng="117.2160052075697" lat="31.85925241707919" value="340000000000">安徽省</option>
                
                    <option lng="117.98494311990739" lat="26.050118295660658" value="350000000000">福建省</option>
                
                    <option lng="115.67608236670434" lat="27.757258443440838" value="360000000000">江西省</option>
                
                    <option lng="118.52766339287801" lat="36.09928992972826" value="370000000000">山东省</option>
                
                    <option lng="113.48680405752653" lat="34.157183767956038" value="410000000000">河南省</option>
                
                    <option lng="112.41056219213214" lat="31.209316250139748" value="420000000000">湖北省</option>
                
                    <option lng="111.720663546476" lat="27.695864052356379" value="430000000000">湖南省</option>
                
                    <option lng="113.3948175587587" lat="23.40800372902474" value="440000000000">广东省</option>
                
                    <option lng="108.92427442705878" lat="23.552254688119406" value="450000000000">广西壮族自治区</option>
                
                    <option lng="109.73375548794272" lat="19.18050080126052" value="460000000000">海南省</option>
                
                    <option lng="106.53063501341296" lat="29.54460610888615" value="500000000000">重庆市</option>
                
                    <option lng="102.89915972360397" lat="30.36748093795755" value="510000000000">四川省</option>
                
                    <option lng="106.7349961033045" lat="26.902825927796763" value="520000000000">贵州省</option>
                
                    <option lng="101.59295163700766" lat="24.86421279548333" value="530000000000">云南省</option>
                
                    <option lng="89.1379816840313" lat="31.36731540271471" value="540000000000">西藏自治区</option>
                
                    <option lng="109.50378929072508" lat="35.860026261322769" value="610000000000">陕西省</option>
                
                    <option lng="102.45762459933961" lat="38.10326734375233" value="620000000000">甘肃省</option>
                
                    <option lng="96.20254367226112" lat="35.499761004274677" value="630000000000">青海省</option>
                
                    <option lng="106.15548126505365" lat="37.32132311229541" value="640000000000">宁夏回族自治区</option>
                
                    <option lng="85.61489933833856" lat="42.127000957642369" value="650000000000">新疆维吾尔自治区</option>
                
            </select>
        </div>
        <div class="local-sel-box box-size f-left">
            <select class="local-sel f-left box-size" id="citySelect">

            </select>
        </div>
        <div class="local-sel-box box-size f-left">
            <select class="local-sel f-left box-size" id="townSelect">

            </select>
        </div>
    </div>
    <section class="sectionList">
        <ul id="storeList">
            
        </ul>
    </section>
</div>
<div class="bot-copy">
    <div class="copyBox">
        <span class="copyIcon"></span>
        <p>华阳信通·技术支持</p>
    </div>
</div>


<script type="text/javascript" src="http://api.map.baidu.com/api?ak=uXbPc4jesrD9FwqDKZNe0tibip2K4ljW&v=2.0"></script>
<script src="el-imfans/resources/wapItem/wap_new/js/jquery-1.10.2.min.js"></script>
<script src="el-imfans/resources/wapItem/wap_new/js/Pull_Event.js"></script>
<script>
    var totalPage = 0;
    var pageNum = 1;
    var map;
    var level = 14;
    var pull;
    $(function(){
        doLocation();
        var circleList = new Array();
        $('.local-sel-box select').unbind('change').change(function(){
            var $this = $(this) , id = $this.attr('id'),code = $(this).find('option:selected').val(), val = $(this).find('option:selected').text();
            var lng = $this.find('option:selected').attr("lng");
            var lat = $this.find('option:selected').attr("lat");
            if(code != ''){
                if(id == 'provinceSelect'){
                    selectRegion($this,$("#citySelect"));
                    $('#citySelect').val("");
                    $('#townSelect').val("");
                    circleList[0] = code;
                    circleList[1] = "";
                    circleList[2] = "";
                    level = 7;
                    showMap(lng,lat,circleList);
                }else if(id == 'citySelect'){
                    selectRegion($this,$("#townSelect"));
                    $('#townSelect').val("");
                    $('#streetSelect').val("");
                    circleList[1] = code;
                    circleList[2] = "";
                    level = 10;
                    showMap(lng,lat,circleList);
                }else if(id == 'townSelect'){
                    level = 14;
                    circleList[2] = code;
                    showMap(lng,lat,circleList);
                }
            }
        });

        $("#storeList").delegate('li','click',function(){
            var $this = $(this);
            window.location.href = 'el-imfans/wap/fans/listCounselors/e90cd736-e61d-4cbd-8cd7-36e61d4cbd6e/57688994-95be-4d5d-a889-9495becd5d02/'+ $this.attr('id') + "?partnerId=e90cd736-e61d-4cbd-8cd7-36e61d4cbd6e";
        });

        // 滑动加载更多...
        pull = new Pull_Event({
            prompt_selector: '.sectionList',//结合prompt_method，指定‘加载中’提示出现的位置，若不传提示出现在body结束前
            prompt_method: 'append',//before|prepend|append|after
            handle: function() {
                var _this = this;
                pageNum++;
                if (pageNum > totalPage){
                    _this.destroy();
                    return;
                }
                searchNearStores(pageNum,10,function(){
                    _this.done();
                },0);
            }
        });
    });

    /**
     *  选择区域
     **/
    function selectRegion(own,sub){
        var parentId = $(own).val();
        if(""==parentId){
            return ;
        }
        $.ajax({
            url: "el-imfans/wap/fans/loadCircle",
            dataType: "json",
            type: "POST",
            cache: false,
            async:false,
            data: {
                parentId:parentId
            },
            success: function (data) {
                $(sub).empty();
                $(sub).append('<option lng="" lat="" value="">请选择</option>');
                $.each(data.circle, function (i, v) {
                    $(sub).append('<option lng="'+ v.lng +'" lat="'+ v.lat +'" value="'+v.id+'">'+ v.name+'</option>');
                })
            },
            error: function (e) {showMsg("系统错误,请重试!");}
        });
    }

    var myIcon = new BMap.Icon("http://api.map.baidu.com/mapCard/img/location.gif",   new BMap.Size(14, 23), {anchor: new BMap.Size(7, 25)});
    /**
     * 获取当前坐标并显示地图
     */
    function doLocation(){
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(locationSuccess, locationError,{
                // 指示浏览器获取高精度的位置，默认为false
                enableHighAcuracy: true,
                // 指定获取地理位置的超时时间，默认不限时，单位为毫秒
                timeout: 5000,
                // 最长有效期，在重复获取地理位置时，此参数指定多久再次获取位置。
                maximumAge: 3000
            });
        }else{
            doLocationByIp();
        }
    }
    function locationSuccess(position){
        var coords = position.coords;
        var longitude = coords.longitude;//估计经度
        var latitude = coords.latitude;//估计纬度
        //坐标转换API  lng 经度 lat 纬度
        var coordss = longitude + "," + latitude;
        $.ajax({
            type : 'GET',
            url : "http://api.map.baidu.com/geoconv/v1/?coords=" + coordss + "&ak=uXbPc4jesrD9FwqDKZNe0tibip2K4ljW&output=json",
            async : false,
            dataType : "jsonp",
            beforeSend:function(){
                showLoading();
            },
            success : function (o) {
                if (o.status == 0) {
                    var lng = o.result[0].x;
                    var lat = o.result[0].y;
                    setLocation(lng,lat,14);
                }
            }
        });
    }

    function setLocation(lng,lat,level){//获得gps坐标，使用百度地图需要转换一下
        var point = new BMap.Point(lng,lat); //创建点坐标
        var gc = new BMap.Geocoder();//创建地理编码实例
        $('#longitude').val(lng);
        $('#latitude').val(lat);
        gc.getLocation(point, function(rs){//根据坐标得到地址描述
            var addComp = rs.addressComponents;//根据坐标获得地址描述
            $('#province-l').val(addComp.province);
            $('#city-l').val(addComp.city);
            $('#district-l').val(addComp.district);
            $('#street-n-l').val(addComp.street + " " + addComp.streetNumber);
            $('#location-s').text(rs.address );
            setAddressByLoc(point.lng,point.lat,level);
        });
        pageNum = 1;
    }

    function setAddressByLoc(lng,lat,level){
        var province = $('#province-l').val() ;
        var city = $('#city-l').val();
        var district = $('#district-l').val();
        var street = $('#street-n-l').val();
        //转换代码
        province = transferNameToCode('',province,2);
        city = transferNameToCode(province,city,3);
        district = transferNameToCode(city,district,4);
        var circleListStr = province + '-' + city;
        //标记
        var point = new BMap.Point(lng,lat); //获得gps坐标，使用百度地图需要转换一下
        map = new BMap.Map("allmap");
        map.centerAndZoom(point, level);
        //map.addControl(new BMap.ZoomControl());          //添加地图缩放控件
        //map.addControl(new BMap.ScaleControl());
        var marker = new BMap.Marker(point);        // 创建标注
        map.addOverlay(marker);
        //查询附近的门店
        $('#circleList').val(circleListStr);
        searchNearStores(1,10,null,0);
        /**
         *需求要求默认不选中
         */
/*        $('#provinceSelect').val(province);
        $('#provinceSelect').change();
        $('#citySelect').val(city);
        $('#citySelect').change();
        $('#townSelect').val(district);*/
    }

    /**
     * 显示地图
     */
    function showMap(lng,lat,circleList){
        var point = new BMap.Point(lng,lat); //获得gps坐标，使用百度地图需要转换一下
        map = new BMap.Map("allmap");
        map.centerAndZoom(point, level);
        //map.addControl(new BMap.ZoomControl());          //添加地图缩放控件
        //map.addControl(new BMap.ScaleControl());
        var marker = new BMap.Marker(point);        // 创建标注
        map.addOverlay(marker);

        var circleListStr = "";
        $.each(circleList, function (i, v) {
            if("" !=v && 0==i){
                circleListStr += v;
            }else if("" !=v){
                circleListStr += "-"
                circleListStr += v;
            }
        });
        if(circleList[1]=="")//切换省，需要在后面加一横杠
        {
            circleListStr = circleListStr + "-";
        }
        var haschoicetown = 0;
        if(circleList[2]!=""&&circleList[2]!=undefined)//切换省，需要在后面加一横杠
        {
            haschoicetown=1;
        }
        console.log(haschoicetown);
        pageNum = 1;
        pull.init();//重新监听下拉事件
        $('#storeList').empty();
        $('#longitude').val(lng);
        $('#latitude').val(lat);
        $('#circleList').val(circleListStr);
        searchNearStores(1,10,null,haschoicetown);
    }

    function locationError(error){
        switch(error.code){
            case  error.PERMISSION_DENIED: //1
                break;
            case  error.POSITION_UNAVAILABLE:   //2
                break;
            case  error.TIMEOUT:  //3
                break;
            case  error.PERMISSION_DENIED: //4
                break;
        }
        doLocationByIp();
    }

    /**
     * IP定位API
     */
    function doLocationByIp(){
        $.ajax({
            type: 'GET',
            url : "http://api.map.baidu.com/location/ip?ak=uXbPc4jesrD9FwqDKZNe0tibip2K4ljW&ip=&coor=bd09ll",
            async: false,
            dataType: "jsonp",
            beforeSend:function(){
                showLoading();
            },
            success: function(o){
                if(o.status==0){
                    setLocation(o.content.point.x,o.content.point.y,14);
                }
            }
        });
    }
    function showLoading(){
        $('#allmap').text('地图加载中...');
        $('#storeList').html('<li id="loading" class="box-size"><span>正在查找附近门店...</span></li>');
    }

    /**
     * 通过地址name转换华阳信通库的code
     * @param name
     * @param level
     */
    function transferNameToCode(parentCode,name,level){
        var circleCode = "";
        $.ajax({
            url: "/el-imfans/wap/fans/transferNameToCode",
            dataType: "json",
            type: "POST",
            cache: false,
            async:false,
            data: {
                parentCode:parentCode,
                name:name,
                level:level
            },
            success: function (data) {
                circleCode = data.circleCode;
            },
            error: function (e) {showMsg("地址名称转地址代码错误,请稍后重试!");}
        });
        return circleCode;
    }
    /**
     * 查询附近的门店
     */
    function searchNearStores(pageNum,pageSize,callback,hasTown){
        console.log("jjj",hasTown)
        var lng = $("#longitude").val();
        var lat = $("#latitude").val();
        var circleListStr = $("#circleList").val();
        $.ajax({
            url: "/el-imfans/wap/fans/searchNearStores",
            dataType: "json",
            type: "POST",
            cache: false,
            async:false,
            data: {
                lng:lng,
                lat:lat,
                circleList:circleListStr,
                shopId:'57688994-95be-4d5d-a889-9495becd5d02',
                partnerId:"",
                pageNum:pageNum,
                pageSize:pageSize,
                haschoiceTown:hasTown
            },
            success: function (data) {
                totalPage = data.totalPages;
                var html='';
                if (data.content.length==0) {
                    $("#storeList").html('<div style="padding:64px 0;text-align:center;font-size:24px;">暂无附近门店</div>');
                    return false;
                }
                $.each(data.content, function (i, v) {
                    html += '<li class="box-size" id="'+ v.id +'">';
                    html += '<a class="box-size ellip" href="javascript:void(0);">';
                    html += '<span class="f-right l_distance ellip">'+ v.distance +'km</span>';
                    html += '<span class="f-right l_guwen ellip">'+ v.storeEmpsCount +'个顾问</span>';
                    html += '<span class="f-right l_store ellip">'+ v.name +'</span>';
                    html += '</a>';
                    html += '</li>';
                    addMarkerToMap(map, v.longitude, v.latitude);
                })
                $("#loading").remove();
                $('#storeList').append(html);
                callback && callback();
            },
            error: function (e) {showMsg("系统错误,请稍后重试!");}
        });
    }
    /**
     * 向地图中添加标注
     * @param map
     * @param lng
     * @param lat
     */
    function addMarkerToMap(map,lng,lat){
        var point = new BMap.Point(lng,lat);
        var marker = new BMap.Marker(point, {icon: myIcon});        // 创建标注
        map.addOverlay(marker);
    }
</script>
</body>
</html>